import { createRouter, createWebHistory } from 'vue-router'
import Login from '@/views/Login.vue'
import MainBox from '@/views/MainBox.vue'
import RoutesConfig from './config'
import store from '@/store'

//定义路由
const routes = [
  {
    //路由登陆页面
    path: '/login',
    name: 'login',
    component: Login,
  },
  {
    //路由 登陆成功后的总界面
    path: '/mainbox',
    name: 'mainbox',
    component: MainBox,
    //mainbox的嵌套路由/子路由，放router/config内了 用于根据权限动态添加
  }
]

//引入路由
const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes
})

//每次路由跳转以前的路由拦截 登陆成功后再显示mainbox的嵌套路由
router.beforeEach((to, from, next) => {
  if (to.name === 'login') {
    //未授权 重定向到login
    next()
  } else {
    //如果授权（已经登陆过）next()
    if (!localStorage.getItem("token")) {
      next({
        path: "login"
      })
    } else {
      //如果是第一次访问时执行路由并放行目标路由的完整路径 否则直接放行(说明路由都添加好了) 所以这个第一次很重要(这个第一次存到store vuex 用于共享状态)
      if (!store.state.isGetterRouter) {
        ConfigRouter()
        next({
          //重新往路径再走一遍
          //在 Vue Router 中，to.fullPath 是路由导航守卫（如 beforeEach）中 目标路由对象（to） 的一个属性，它表示 即将导航到的目标路由的完整路径，包含 路径、查询参数（query）和哈希（hash）
          path: to.fullPath
        })
      }else{
        next()
      }

    }
  }
})


//给mainbox添加router/config内路由数组
const ConfigRouter = () => {
  RoutesConfig.forEach(item => {
    router.addRoute("mainbox", item)
  })

  //第一次登陆成功进来配置完后就不再进来 不是第一次时候改为ture放行
  store.commit("changeGetterRouter", true)
}


export default router
